<!--
  ~ Electronic Logistics Management Information System (eLMIS) is a supply chain management system for health commodities in a developing country setting.
  ~
  ~ Copyright (C) 2015  John Snow, Inc (JSI). This program was produced for the U.S. Agency for International Development (USAID). It was prepared under the USAID | DELIVER PROJECT, Task Order 4.
  ~
  ~ This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.
  ~
  ~ This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details.
  ~
  ~ You should have received a copy of the GNU Affero General Public License along with this program.  If not, see <http://www.gnu.org/licenses/>.
  -->


<div>
  <h2 openlmis-message="label.equipment.my.maintenance.request"></h2>

  <p openlmis-message="label.equipment.my.maintenance.request.description"></p>

  <div class="alert alert-success" ng-show="message">
    <span ng-bind="message"></span>
  </div>

  <div>
    <table class="table table-bordered">
      <thead>
      <tr class="gradient-header">
        <th>#</th>
        <th openlmis-message="label.equipment.maintenance.requesting.facility"></th>
        <th openlmis-message="label.equipment.equipment"></th>
        <th openlmis-message="label.equipment.maintenance.request.date"></th>
        <th openlmis-message="label.equipment.maintenance.request.reason"></th>
        <th openlmis-message="label.equipment.maintenance.request.recommended.date"></th>
        <th></th>
      </tr>
      </thead>
      <tbody>
      <tr ng-repeat="row in list">
        <td>{{$index + 1}}</td>
        <td>{{row.facilityName}}</td>
        <td>{{row.equipmentName}}</td>
        <td>{{row.requestedDateString}}</td>
        <td>{{row.reason}}</td>
        <td>{{row.recommendedDateString}}</td>
        <th class="span1"><input type="button" class="btn btn-small" ng-click="respondToRequest(row)" value="Respond"/></th>
      </tr>
      <tr>
        <td colspan="7" openlmis-message="label.no.maintenance.request.pending"></td>
      </tr>
      </tbody>
    </table>
  </div>

  <div id="maintenanceRequestResponseDiv" modal="maintenanceRequestResponseModal"
       options="{'backdrop':'static', 'escape':false}">
    <div class="modal-header">
      <h3>
        <span>Register Response</span>
      </h3>
    </div>

    <div class="modal-body">
      <form name="maintenanceRequestResponseForm">
        <div>
          <div class="row-fluid">
            <div class="span6">
              <label for="servicePerformedValue"><span>Service Performed</span></label>
            </div>
            <div class="span4">
              <textarea ng-required="true" type="text"
                        name="servicePerformedValue" id="servicePerformedValue"
                        ng-model="currentRequest.maintenanceDetails.servicePerformed"></textarea>
            </div>
          </div>
          <div class="row-fluid">
            <div class="span6">
              <label for="findingForCurrentValue"><span>Finding</span></label>
            </div>
            <div class="span4">
              <textarea ng-required="true" type="text"
                        name="findingForCurrentValue" id="findingForCurrentValue"
                        ng-model="currentRequest.maintenanceDetails.finding"></textarea>
            </div>
          </div>
          <div class="row-fluid">
            <div class="span6">
              <label for="responseCommentValue"><span>Comment</span></label>
            </div>
            <div class="span4">
              <textarea ng-required="true" type="text"
                        name="responseCommentValue" id="responseCommentValue"
                        ng-model="currentRequest.vendorComment"></textarea>
            </div>
          </div>
          <div class="row-fluid">
            <div class="span6">
              <label for="nextVisitDateValue"><span>Next Service Date</span></label>
            </div>
            <div class="span4">
              <input
                ng-model="currentRequest.maintenanceDetails.nextVisitDate"
                id="nextVisitDateValue"
                name="nextVisitDateValue"
                ng-required="false"
                type="date"
                />
            </div>
          </div>
        </div>

      </form>
      <div class="alert alert-error" id="saveFailMessage" openlmis-message="error" ng-show="error"></div>
    </div>

    <div class="modal-footer">
      <input type="button" class="btn btn-primary save-button" value="Update"
             ng-click="saveResponse()"/>
      <input type="button"
             ng-click="closeModal();error=''"
             class="btn btn-cancel" openlmis-message="button.cancel"/>
    </div>

  </div>


</div>